<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button type="button" id="btn1">查询</button>
		
	</body>
	<script src="js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		$("#btn1").click(function(){
			$.ajax({
				type:"get",//请求方式
				url:"js/user_data.json",//请求地址
				data:{
					uname:"zhangsan"//如果没有参数，则不需要设置
				},
				dataType:"json",//与其返回的数据类型,如果是json格式，在接收到返回值时会自动封装成json对象
				
				//请求成功时调用的函数
				success:function(data){//data是形参名，代表的是返回的数据
					console.log(data.data);
					//创建ul
					var ul=$("<ul></ul>");
					// 遍历返回的数据数组
					for(var i=0;i<data.data.length;i++){
						//得到数组中的每一个元素
						var user=data.data[i];
						//创建li元素
						var li="<li>"+user.id+"</li>";
						ul.append(li);
					}
					console.log(ul);
					//将ul加入到body中
					$("body").append(ul);
				}
			});
		});
		
		
	</script>
</html>
